layui.use(function(){
    var dropdown = layui.dropdown;
    var $=layui.$;
    var layer=layui.layer;
    beforeUpload();

    function beforeUpload(){
        $.ajax({
            url:"/custom",
            method:'get',
            data:{
                action:"selectCusName",
                name:$("h4").html()
            },
            dataType:"json",
            success:function (data){
                if(data.code==200){
                   loadcontact(data);
                }
            }
        })
    }
    function  loadcontact(data) {
        if(data.data.length==0){
            layer.alert("该客户无下级客户")
            $(".render_below").html(`
                    <div style="display: flex;justify-content: space-between;">
\t\t\t<div class="layui-btn layui-btn-normal">详细信息</div>
\t\t\t<a href="" style="color: blue">查看详情</a>
\t\t</div>
\t\t<ul class="layui-ul">
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户名称:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户类型:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">所属行业:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户星级:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">客户来源:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户状态:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">客户归属:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">首要联系人</div>
\t\t\t<a href="">查看详情</a>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">联系人姓名:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">手机号码:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">角色:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">部门职务:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">生日:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">电子邮箱:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">固定电话:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">传真号码:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
                    `)
            return;
        }
        $.ajax({
            url:"/custom",
            method:'get',
            data:{
                action:'selectContact',
                id:data.data[0].contactId
            },
            dataType:"json",
            success:function (res){
                if(res.code==200){
                    $(".render_below").html(`
                    <div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">详细信息</div>
\t\t\t<a href="">查看详情</a>
\t\t</div>
\t\t<ul class="layui-ul">
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">客户名称:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].name}</div>
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec">143232342</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">客户类型:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusType}</div>
\t\t\t\t<div class="tab_type ">所属行业:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].belIndustry}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">客户星级:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusStar}</div>
\t\t\t\t<div class="tab_type ">客户来源:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].resource}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">客户状态:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusState}</div>
\t\t\t\t<div class="tab_type ">客户归属:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">首要联系人</div>
\t\t\t<a href="">查看详情</a>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type ">联系人姓名:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].name}</div>
\t\t\t\t<div class="tab_type">手机号码:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].phone}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">角色:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].role}</div>
\t\t\t\t<div class="tab_type ">部门职务:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].deptJob}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">生日:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].birthday}</div>
\t\t\t\t<div class="tab_type ">电子邮箱:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].email}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-warm">
\t\t\t\t<div class="tab_type">固定电话:</div>
\t\t\t\t<div class="tab_type_sec"> ${res.data[0].fixedPhone}</div>
\t\t\t\t<div class="tab_type ">传真号码:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].transPhone}</div>
\t\t\t</li>
\t\t</ul>   `)
           }
         }
      })
    }

    // 渲染
    dropdown.render({
        elem: '#add', // 绑定元素选择器，此处指向 class 可同时绑定多个元素
        data: [{
            title: '工单',
            id:"workrecord"
        },{
            title: '商机',
            id: "buychance"
        },{
            title: '订单',
            id: "order"
        },{
            title: '费用',
            id: "fee"
        },{
            title: '联系人',
            id: "contact"
        }
        ],
        click: function(obj){
            this.elem.find('span').text(obj.title);
            if(obj.id=="workrecord"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '添加工单',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/user/addWorkOrder.jsp'
                });
            }else if (obj.id=="buychance"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '添加商机',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/user/addBuyChance.jsp'
                });
            }else if (obj.id=="order"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '添加订单',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/user/addOrder.jsp'
                });
            }else if(obj.id=="fee"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '添加费用',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/user/addCost.jsp'
                });
            }else if(obj.id=="contact"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '添加联系人',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/user/addContactUser.jsp'
                });
            }
        }
    });
    dropdown.render({
        elem: '#new', // 绑定元素选择器，此处指向 class 可同时绑定多个元素
        data: [{
            title: '普通任务',
            id:"normal"
        },{
            title: '跟进任务',
            id: "track"
        }],
        click: function(obj){
            this.elem.find('span').text(obj.title);
            if(obj.id=="normal"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '普通任务',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content:'/admin/page/system/user/addOrdinary.jsp'
                });
            }else if (obj.id=="track"){
                layer.open({
                    type: 2, // page 层类型
                    area: ['100%', '100%'],
                    title: '跟进任务',
                    shade: 0.6, // 遮罩透明度
                    shadeClose: true, // 点击遮罩区域，关闭弹层
                    maxmin: true, // 允许全屏最小化
                    anim: 0, // 0-6 的动画形式，-1 不开启
                    content: '/admin/page/system/cusFunction/addTask.jsp'
                });
            }
        }
    });


    $("#addFollow").click(function (){
        layer.open({
            type: 2, // page 层类型
            area: ['100%', '100%'],
            title: '添加跟进',
            shade: 0.6, // 遮罩透明度
            shadeClose: true, // 点击遮罩区域，关闭弹层
            maxmin: true, // 允许全屏最小化
            anim: 0, // 0-6 的动画形式，-1 不开启
            content: '/admin/page/system/user/addFollow.jsp'
        });
    })
    $("#transferCus").click(function (){
        layer.open({
            type: 2, // page 层类型
            area: ['100%', '100%'],
            title: '转移客户',
            shade: 0.6, // 遮罩透明度
            shadeClose: true, // 点击遮罩区域，关闭弹层
            maxmin: true, // 允许全屏最小化
            anim: 0, // 0-6 的动画形式，-1 不开启
            content: '/admin/page/system/cusFunction/transferCus.jsp'
        });
    })
    $("#transferSea").click(function (){
        layer.open({
            type: 2, // page 层类型
            area: ['500px', '500px'],
            title: '移入公海',
            shade: 0.6, // 遮罩透明度
            shadeClose: true, // 点击遮罩区域，关闭弹层
            maxmin: true, // 允许全屏最小化
            anim: 0, // 0-6 的动画形式，-1 不开启
            content: '/admin/page/system/user/transferSea.jsp'
        });
    })
    $("#addCooperation").click(function (){
        layer.open({
            type: 2, // page 层类型
            area: ['100%', '100%'],
            title: '添加协作',
            shade: 0.6, // 遮罩透明度
            shadeClose: true, // 点击遮罩区域，关闭弹层
            maxmin: true, // 允许全屏最小化
            anim: 0, // 0-6 的动画形式，-1 不开启
            content: '/admin/page/system/user/addCooperation.jsp'
        });
    });
    $("#delete").click(function () {
        layer.confirm('是否确定删除对应的记录', {
            title: '确认提示',
            icon: 3, // 问号图标
            btn: ['确定', '取消'] // 指定两个按钮
        }, function(index){
            // 确定按钮的回调函数
            layer.close(index);
            // 这里可以添加删除记录的逻辑
            $.ajax({
                url: '/', // 后端删除接口的 URL
                type: 'post', // HTTP 请求方法
                data: { id: data[0].id }, // 要删除的记录 ID
                success: function(response) {
                    if (response.success) {
                        // 删除成功后，显示成功提示
                        layer.msg('记录删除成功', { icon: 1 });
                        // 你可以在这里添加其他逻辑，例如刷新页面或更新表格

                    } else {
                        // 删除失败，显示错误提示
                        layer.msg('删除失败：' + response.message, { icon: 2 });
                    }
                },
                error: function(xhr, status, error) {
                    // 处理网络错误或其他异常
                    layer.msg('网络错误，请稍后再试', { icon: 2 });
                    console.error('AJAX 请求失败:', error);
                }
            });
        }, function(index){
            // 取消按钮的回调函数
            layer.close(index);
        });
    })

    $("#all_infor").click(function (){
        console.log(1)
        beforeUpload();
    })
    $("#detail_infor").click(function (){
        console.log(2)
        detailUpload();
    })



    function  detailUpload(){
        console.log(3)
        $.ajax({
            url:"/custom",
            method:'get',
            data:{
                action:"selectCusName",
                name:$("h4").html()
            },
            dataType:"json",
            success:function (data){
                if(data.code==200){
                    loadDetail(data)
                }
            }
        })
    }

  async  function loadDetail(data){
        console.log(4)
        if(data.data.length==0){
            layer.alert("该客户无下级客户")
            $(".render_below").html(`
<div class="layui-btn"><span class="layui-btn layui-btn-normal" id="editDetail">编辑</span><span class="layui-btn layui-btn-normal">导出</span></div>
<div style="display: flex;justify-content: space-between;">
\t\t\t<div class="layui-btn layui-btn-normal">基本信息</div>
\t\t</div>
\t\t<ul class="layui-ul">
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户名称:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户类型:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">所属行业:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户星级:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">客户来源:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户状态:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">客户归属:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">附加信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">所在地区:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">详细地址:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">企业规模:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">上级客户:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">下级客户:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">备注信息:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">财务信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">已交金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">已回款金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">已开票金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">未开票金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">潜在交易金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">费用总金额:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">系统信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type">协作人员:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">所属部门:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">创建人员:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">前归属人:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">前所属销售部:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">创建时间:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">更新时间:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">最后跟进:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t\t<div class="tab_type ">下次跟进:</div>
\t\t\t\t<div class="tab_type_sec"></div>
\t\t\t</li>
\t\t</ul>
                    `)
            $("#editDetail").click(function (){
                console.log(1)
                layer.open({
                    title : "添加客户",
                    type : 2,
                    content : "/admin/page/system/user/userAdd.jsp",
                    area:['100%','100%'],
                })
            })
            return;
        }
        console.log(6)

        let response=await $.ajax({
            url:"/custom",
            method:'get',
            data:{
                action:'selectExtreById',
                id:data.data[0].id
            },
            dataType:"json",
        })
      if(response.code==200){
          thirdFetch(data,response)
      }
    }
    function thirdFetch(data,res){
        console.log(res)
        $.ajax({
            url:"/custom",
            method:'get',
            data:{
                action:'selectFollowDetail',
                name:data.data[0].name
            },
            dataType:"json",
            success:function (outcome){
                if(outcome.code==200){
                    $(".render_below").html(`
<div class="layui-btn"><span class="layui-btn layui-btn-normal" id="editDetail">编辑</span><span class="layui-btn layui-btn-normal">导出</span></div>
<div style="display: flex;justify-content: space-between;">
\t\t\t<div class="layui-btn layui-btn-normal">基本信息</div>
\t\t</div>
\t\t<ul class="layui-ul">
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户名称:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].name}</div>
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec">532242</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户类型:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusType}</div>
\t\t\t\t<div class="tab_type ">所属行业:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].belIndustry}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户星级:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusStar}</div>
\t\t\t\t<div class="tab_type ">客户来源:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].resource}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">客户状态:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].cusState}</div>
\t\t\t\t<div class="tab_type ">客户归属:</div>
\t\t\t\t<div class="tab_type_sec">${data.data[0].contactId}</div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">附加信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">所在地区:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].area}</div>
\t\t\t\t<div class="tab_type">详细地址:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].address}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">企业规模:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].scale}</div>
\t\t\t\t<div class="tab_type ">上级客户:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].parentName}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">下级客户:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].lowName}</div>
\t\t\t\t<div class="tab_type ">备注信息:</div>
\t\t\t\t<div class="tab_type_sec">${res.data[0].extraInfo}</div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">财务信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">已交金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t\t<div class="tab_type">已回款金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">已开票金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t\t<div class="tab_type ">未开票金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">潜在交易金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t\t<div class="tab_type ">费用总金额:</div>
\t\t\t\t<div class="tab_type_sec">10000</div>
\t\t\t</li>
\t\t</ul>
\t\t<div style="display: flex;justify-content: space-between;">
\t\t\t<div  class="layui-btn layui-btn-normal">系统信息</div>
\t\t</div>
\t\t<ul>
\t\t\t<li class="li_sty layui-btn layui-btn-normal" >
\t\t\t\t<div class="tab_type">系统编号:</div>
\t\t\t\t<div class="tab_type_sec">23489042</div>
\t\t\t\t<div class="tab_type" >协作人员:</div>
\t\t\t\t <div id="helpPeople"></div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">所属部门:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].dept}</div>
\t\t\t\t<div class="tab_type ">创建人员:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].createPeople}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">前归属人:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].befPeople}</div>
\t\t\t\t<div class="tab_type ">前所属销售部:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].befDept}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">创建时间:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].createTime}</div>
\t\t\t\t<div class="tab_type ">更新时间:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].updateTime}</div>
\t\t\t</li>
\t\t\t<li class="li_sty layui-btn layui-btn-normal">
\t\t\t\t<div class="tab_type">最后跟进:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].finishTime}</div>
\t\t\t\t<div class="tab_type ">下次跟进:</div>
\t\t\t\t<div class="tab_type_sec">${outcome.data[0].secTime}</div>
\t\t\t</li>
\t\t</ul>
                    `)
                    $("#editDetail").click(function (){
                        console.log(1)
                        layer.open({
                            title : "添加客户",
                            type : 2,
                            content : "/admin/page/system/user/userAdd.jsp",
                            area:['100%','100%'],
                        })
                    })
                    let helpPeople= outcome.data[0].helpContact.map((item)=>{
                        return `<span>${item}</span> `
                    }).join("")
                    $("#helpPeople").append(helpPeople);
                }
            }
        })
    }


    $("#follow_record").click(function () {
        followDetail();
    })

    function followDetail() {
        $.ajax({
            url:"/follow",
            method:'get',
            data:{
                action:"selectAll",
            },
            dataType:"json",
            success:function (data){
                if(data.code==200){
                    followDetail1(data)
                }
            }
        })
    }
    async  function followDetail1(data) {
        if(data.data.length==0) {
            $(".render_below").html(`
\t\t\t\t<div class="layui-row" >
\t<div class="layui-col-md9">
\t<div class="grid-demo grid-demo-bg1">
\t\t\t<h3 style="padding: 20px;">跟进记录</h3> 
\t\t</div>
\t</div>
\t<div class="layui-col-md3">
\t<div class="grid-demo">
\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" style="margin-top: 20px;">导出</button><br />
\t\t</div>
\t</div>
\t</div>
<div class="layui-row" style="background-color: #d8fffe;">
\t<div class="layui-col-md9">
\t<div class="grid-demo grid-demo-bg1">
\t\t<ul>
\t\t\t<li></li>
\t\t\t<li></li>
\t\t\t<li>来自客户：</li>
\t\t</ul>
\t</div>
\t</div>
\t<div class="layui-col-md3">
\t<div class="grid-demo">
\t\t<ul>
\t\t\t<li></li>
\t\t\t<li>
\t\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="detail">详情</button>
\t\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="comment">评论</button>
\t\t\t</li>
\t\t</ul>
\t</div>
\t</div>
</div>
        `)
            return;
        }
        $.ajax({
            url: "/follow",
            method: 'get',
            data: {
                action: 'selectAll',
            },
            dataType: "json",
            success: function (res) {
                if (res.code == 200) {
                    $(".render_below").html(`
                    <div class="layui-row" >
\t  <div class="layui-col-md9">
\t    <div class="grid-demo grid-demo-bg1">
\t\t\t
\t\t\t<h3 style="padding: 20px;">跟进记录</h3> 
\t\t</div>
\t  </div>
\t  
\t  <div class="layui-col-md3">
\t    <div class="grid-demo">
\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" style="margin-top: 20px;">导出</button><br />
\t\t\t
\t\t</div>
\t  </div>
\t</div>\t
<div class="layui-row" style="background-color: #d8fffe;">
  <div class="layui-col-md9">
    <div class="grid-demo grid-demo-bg1">
\t\t<ul>
\t\t\t<li>${data.data[0].contactUser}</li>
\t\t\t<li>${data.data[0].remarks}</li>
\t\t\t<li>来自客户：${data.data[0].cusName}</li>
\t\t</ul>
\t</div>
  </div>
  <div class="layui-col-md3">
    <div class="grid-demo">
\t\t<ul>
\t\t\t<li>${data.data[0].time}</li>
\t\t\t<li>
\t\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="detail">详情</button>
\t\t\t\t<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="comment">评论</button>
\t\t\t</li>
\t\t</ul>
\t</div>
  </div>
</div>
            `)
                    var id=data.data[0].id;
               $("#detail").click(function () {
                   $.ajax({
                       url: '/follow?action=selectById&id='+id,
                       method: 'GET',
                       dataType: 'json',
                       success: function(res) {
                           if (res.code == 200) {
                               console.log('文档已加载');
                               var detail=`
    
        <p><strong>跟进类型:</strong> <span id="type">${res.data[0].type}</span></p>
        <p><strong>跟进方式:</strong> <span id="mode">${res.data[0].mode}</span></p>
        <p><strong>跟进时间:</strong> <span id="time">${res.data[0].time}</span></p>
        <p><strong>跟进描述:</strong> <span id="remarks">${res.data[0].remarks}</span></p>
        <p><strong>客户名称:</strong> <span id="cusName">${res.data[0].cusName}</span></p>
        <p><strong>客户状态:</strong> <span id="cusType">${res.data[0].cusType}</span></p>
        <p><strong>首要联系人:</strong> <span id="contactUser">${res.data[0].contactUser}</span></p>
        <p><strong>相关附件:</strong> <span id="enclosure">${res.data[0].enclosure}</span></p>
        <p><strong>评论数量:</strong> <span id="count">${res.data[0].count}</span></p>
        <p><strong>跟进人员:</strong> <span id="followUser">${res.data[0].contactUser}</span></p>
        <p><strong>提醒谁看:</strong> <span id="remindWho">${res.data[0].remindWho}</span></p>
        <p><strong>创建时间:</strong> <span id="createdTime">${res.data[0].time}</span></p>
    
    <button type="button" class="layui-btn layui-btn-normal layui-btn-radius action-btn" data-action="update">编辑跟进</button>
    <button type="button" class="layui-btn layui-btn-normal layui-btn-radius action-btn" data-action="del">删除跟进</button>
`
                               var parentLayerIndex =layer.open({
                                   type: 1, // iframe 层
                                   title: '跟进记录详情',
                                   area: ['600px', '700px'],
                                   content: detail, // 传递渲染后的html
                                   success:function (layero,index) {
                                       // 使用事件委托为动态添加的按钮绑定点击事件
                                       $(layero).on('click', '.action-btn', function() {
                                           var action = $(this).data('action');

                                           if (action === 'update') {
                                               layer.open({
                                                   type: 2, // page 层类型
                                                   area: ['700px', '700px'],
                                                   title: '修改跟进',
                                                   shade: 0.6, // 遮罩透明度
                                                   shadeClose: true, // 点击遮罩区域，关闭弹层
                                                   maxmin: true, // 允许全屏最小化
                                                   anim: 0, // 0-6 的动画形式，-1 不开启
                                                   content: '/admin/page/system/user/updateFollow.jsp'
                                               });
                                           } else if (action === 'del') {
                                               layer.confirm('是否确定删除对应的记录', {
                                                   title: '确认提示',
                                                   icon: 3, // 问号图标
                                                   btn: ['确定', '取消'] // 指定两个按钮
                                               }, function(index){
                                                   // 确定按钮的回调函数
                                                   layer.close(index);
                                                   // 这里可以添加删除记录的逻辑
                                                   $.ajax({
                                                       url: '/follow?action=del&id='+id, // 后端删除接口的 URL
                                                       type: 'post', // HTTP 请求方法
                                                       success: function(response) {
                                                           if (response.success) {
                                                               // 删除成功后，显示成功提示
                                                               layer.msg('记录删除成功', { icon: 1 });
                                                               // 你可以在这里添加其他逻辑，例如刷新页面或更新表格
                                                               layer.close(parentLayerIndex); // 关闭父弹出层
                                                           } else {
                                                               // 删除失败，显示错误提示
                                                               layer.msg('删除失败：' + response.message, { icon: 2 });
                                                           }
                                                       },
                                                       error: function(xhr, status, error) {
                                                           // 处理网络错误或其他异常
                                                           layer.msg('网络错误，请稍后再试', { icon: 2 });
                                                           console.error('AJAX 请求失败:', error);
                                                       }
                                                   });
                                               }, function(index){
                                                   // 取消按钮的回调函数
                                                   layer.close(index);
                                               });
                                           }
                                       });
                                   }
                               });
                           }
                       },
                       error: function(xhr, status, error) {
                           console.error('获取数据失败:', error);
                           layer.msg('网络错误，请稍后再试');
                       }
                   });
                });

               $("#comment").click(function () {

               })
                } else {
                    layer.msg("系统异常");
                }

            }
        });
    }




});


